<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
    function init(){
         window.addEventListener("hashchange",()=>{
             let url=location.hash.replace("#","");
             let insertPoint=document.getElementById("insertPoint");
             switch(url){
                 case "emp":
                       insertPoint.innerHTML="普通员工界面";
                       break;
                 case "manager":
                       insertPoint.innerHTML="管理员界面";
                       break;   
             }
         },false);
    }
    window.addEventListener("load",init,false);
    </script>
</head>
<body>
    <ul style="list-style: none;">
       <li style="float: left;width:200px;height: 70px; text-align: center;"><a href="#emp" >员工</a></li>
       <li style="float: left;width:200px;height: 70px; text-align: center;"><a href="#manager">管理员</a></li>
       <br>
       <hr style="clear: both;">
       <div id="insertPoint"></div>
    </ul>
</body>
</html>